import 'package:cached_network_image/cached_network_image.dart';
import 'package:flutter/material.dart' ;
import 'package:flutter/services.dart';
import 'package:flutter_picker/flutter_picker.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import 'package:mfkb/config/Config.dart';
import 'package:mfkb/plugin/MyBehavior.dart';
import 'package:mfkb/service/FunService.dart';
import 'package:toast/toast.dart';
import 'package:tobias/tobias.dart';


class DriverSchool extends StatefulWidget {
  @override
  _DriverSchoolState createState() => _DriverSchoolState();
}

class _DriverSchoolState extends State<DriverSchool> {
  Map<String , dynamic> data = {"img":"" , "icon":"" , "driverType":[] , "descTxt":"相比于移动的高资费，电信和联通的套餐性价比就要高很多了，而且自从工信部提出“提速降费”这一惠民政策，联通和电信的表现也是积极的响应，推出了众多物美价廉的无限流量、互联网套餐和日租卡等等，赢得了不少用户的好评。不过自今年9月份，三家运营商已经纷纷停售了无限流量套餐，改为达量不限速套餐，这也就意味着流量再度进入了收费时代，而可供消费者选择的高性价比套餐似乎也只剩下互联网套餐了。近日，电信的一款互联网套餐，就引起了不少网友的注意。"} ;
  final GlobalKey<ScaffoldState> _scaffoldKey = GlobalKey<ScaffoldState>();

  String phone ;
  int typeId ;
  String types ;

  @override
  void initState() {
    super.initState();
    FunService().driver().then((value){
      if(value["code"] == 200){
        data = value["data"] ;
      }else{
        Toast.show(value["msg"], context) ;
      }
      setState(() {});
    }) ;
  }

  @override
  Widget build(BuildContext context) {
    return AnnotatedRegion<SystemUiOverlayStyle>(
      value: SystemUiOverlayStyle.dark ,
      child: Scaffold(
        key: _scaffoldKey,
        body: Container(
          color:Color.fromARGB(255, 245, 246, 248) ,
          child: Column(
            children: <Widget>[
              Container(
                height: MediaQuery.of(context).padding.top ,
              ) ,
              Container(
                height: 45,
                child: Row(
                  children: <Widget>[
                    Container(
                      width: 17,
                      height: 17,
                      margin: EdgeInsets.only(left:ScreenUtil().setWidth(19)),
                      child: GestureDetector(
                        child: Container(
                          width: 17,
                          height: 17,
                          child: Image.asset("assets/images/back.png" , fit: BoxFit.fill,),
                        ),
                        onTap: (){
                          Navigator.of(context).pop() ;
                        },
                      ),
                    ) ,
                    Expanded(
                      child: Container(
                        child: Center(
                          child: Text("驾校报名" , style: TextStyle( 
                            color: Color.fromARGB(255, 19 , 28 , 53) , 
                            fontSize: ScreenUtil().setSp(18) , 
                            fontWeight: FontWeight.bold  
                          ),), 
                        ),
                      ),
                    ) ,
                    Container(
                      height: 17 ,
                      width: 36 ,
                      margin: EdgeInsets.only(right:ScreenUtil().setWidth(15)) ,
                    ) 
                  ],
                ),
              ) ,
              Expanded(
                child: Container(
                  child: ScrollConfiguration(
                    behavior: MyBehavior() ,
                    child: ListView(
                      padding: EdgeInsets.all(0),
                      children: <Widget>[
                        Container(
                          height: ScreenUtil().setHeight(315),
                          margin: EdgeInsets.only(left:ScreenUtil().setWidth(15) , right:ScreenUtil().setWidth(15) , top:ScreenUtil().setHeight(8)),
                          decoration: BoxDecoration(
                            color:Colors.white ,
                            borderRadius: BorderRadius.all(Radius.circular(8))
                          ),
                          child: Container(
                            child: Column(
                              children: <Widget>[
                                Container(
                                  height: ScreenUtil().setHeight(80),
                                  child: Row(
                                    children: <Widget>[
                                      Container(
                                        width: ScreenUtil().setHeight(50),
                                        height: ScreenUtil().setHeight(50),
                                        margin: EdgeInsets.only(left:ScreenUtil().setWidth(14)),
                                        child: ClipRRect(
                                          borderRadius: BorderRadius.all(Radius.circular(ScreenUtil().setHeight(25))),
                                          child: Container(
                                            child: CachedNetworkImage(
                                              placeholder: (ct , url){
                                                return Container(
                                                  color: Color.fromARGB(255, 246, 245, 248),
                                                  child: Center(
                                                    child: Image.asset("assets/images/imageloading.png"),
                                                  ),
                                                ) ;
                                              },
                                              imageUrl: Config().getImgHost() + data["icon"] ,
                                            ),  
                                          ),
                                        ),
                                      ) ,
                                      Expanded(
                                        child: Container(
                                          height: ScreenUtil().setHeight(50),
                                          margin: EdgeInsets.only(left:ScreenUtil().setWidth(10)),
                                          child: Column(
                                            crossAxisAlignment: CrossAxisAlignment.start ,
                                            children: <Widget>[
                                              Container(
                                                height: ScreenUtil().setHeight(20),
                                                margin: EdgeInsets.only(top:ScreenUtil().setHeight(4)),
                                                child: Text("驾校报名" , style: TextStyle(
                                                  fontSize: ScreenUtil().setSp(16) ,
                                                  color: Color.fromARGB(255, 19, 28, 53) ,
                                                  fontWeight: FontWeight.bold ,
                                                  height: ScreenUtil().setHeight(20) / ScreenUtil().setSp(16)
                                                ),),
                                              ) ,
                                              Container(
                                                height: ScreenUtil().setHeight(12),
                                                margin: EdgeInsets.only(top:ScreenUtil().setHeight(8)),
                                                child: Text("代理报名" , style: TextStyle(
                                                  fontSize: ScreenUtil().setSp(10) ,
                                                  color: Color.fromARGB(255, 121, 132, 155) ,
                                                  height: ScreenUtil().setHeight(12) / ScreenUtil().setSp(10)
                                                ),),
                                              )
                                            ],
                                          ),
                                        ),
                                      ) ,
                                      Container(
                                        width: ScreenUtil().setHeight(16),
                                        height: ScreenUtil().setHeight(16),
                                        margin: EdgeInsets.only(right:ScreenUtil().setWidth(12)),
                                        child: Image.asset("assets/images/more_2x.png" , fit: BoxFit.fill,),
                                      )
                                    ],
                                  ),
                                ) ,
                                Container(
                                  height: ScreenUtil().setHeight(1),
                                  color: Color.fromARGB(255, 236, 237, 241),
                                ) ,
                                Container(
                                  height: ScreenUtil().setHeight(60),
                                  margin: EdgeInsets.only(left:ScreenUtil().setWidth(14)) ,
                                  child: TextField(
                                    decoration: InputDecoration(
                                      hintText: "请输入您的手机号码" ,
                                      border: InputBorder.none ,
                                      hintStyle: TextStyle(
                                        color: Color.fromARGB(255, 121, 132, 155) ,
                                        fontSize: ScreenUtil().setSp(14) ,
                                        height: ScreenUtil().setHeight(60) / ScreenUtil().setSp(14)
                                      ) ,
                                    ),
                                    onChanged: (value){
                                      setState(() {
                                        phone = value ;
                                      });
                                    },
                                  ),
                                ) ,
                                Container(
                                  height: ScreenUtil().setHeight(1),
                                  color: Color.fromARGB(255, 236, 237, 241),
                                  margin: EdgeInsets.only(left:ScreenUtil().setWidth(13) , right:ScreenUtil().setWidth(12)),
                                ) ,
                                GestureDetector(
                                  child: Container(
                                    height: ScreenUtil().setHeight(60),
                                    margin: EdgeInsets.only(left:ScreenUtil().setWidth(14)) ,
                                    child: Row(
                                      children: <Widget>[
                                        Expanded(
                                          child: Container(
                                            child: Text(types == null ? "驾照类型" : types , style: TextStyle(
                                              fontSize: ScreenUtil().setSp(14) ,
                                              color: Color.fromARGB(255, 121, 132, 155)
                                            ),),
                                          ),
                                        ) ,
                                        Container(
                                          width: ScreenUtil().setHeight(16),
                                          height: ScreenUtil().setHeight(16),
                                          margin: EdgeInsets.only(right:ScreenUtil().setWidth(12)),
                                          child: Image.asset("assets/images/more_2x.png" , fit:BoxFit.fill),
                                        )
                                      ],
                                    )
                                  ) ,
                                  onTap: (){
                                    new Picker(
                                      adapter: PickerDataAdapter<String>(
                                        data: List.generate(data["driverType"].length, (index){
                                          return PickerItem(
                                            text: Text(data["driverType"][index]["type"]) ,
                                            value: index.toString()
                                          );
                                        }) 
                                      ),
                                      confirmText: "确认",
                                      confirmTextStyle: TextStyle(
                                        fontSize: ScreenUtil().setSp(16) ,
                                        color: Color.fromARGB(255, 0, 195, 206)
                                      ),
                                      cancelText: "取消" ,
                                      cancelTextStyle: TextStyle(
                                        fontSize: ScreenUtil().setSp(16) ,
                                        color: Color.fromARGB(255, 0, 195, 206)
                                      ),
                                      changeToFirst: true ,
                                      textScaleFactor: 1.3 ,
                                      textAlign: TextAlign.left , 
                                      textStyle: const TextStyle(color: Color.fromARGB(255, 51, 51, 51)),
                                      selectedTextStyle: TextStyle(color: Color.fromARGB(255, 51, 51, 51)),
                                      columnPadding: const EdgeInsets.all(8.0), 
                                      onConfirm: (Picker picker, List value) {
                                        print(picker.getSelectedValues()) ;
                                        setState(() {
                                          types = data["driverType"][value[0]]["type"] ;
                                          typeId = data["driverType"][value[0]]["id"] ;
                                        });
                                      }
                                    ).show(_scaffoldKey.currentState) ;
                                  },
                                ) ,
                                Container(
                                  height: ScreenUtil().setHeight(1),
                                  color: Color.fromARGB(255, 236, 237, 241),
                                  margin: EdgeInsets.only(left:ScreenUtil().setWidth(13) , right:ScreenUtil().setWidth(12)),
                                ) ,
                                GestureDetector(
                                  child: Container(
                                    margin: EdgeInsets.only(left:ScreenUtil().setWidth(33) , right:ScreenUtil().setWidth(32) , top:ScreenUtil().setHeight(26)),
                                    height: ScreenUtil().setHeight(48),
                                    decoration: BoxDecoration(
                                      color: Color.fromARGB(255, 0, 195, 206) ,
                                      borderRadius: BorderRadius.all(Radius.circular(8))
                                    ),
                                    child: Center(
                                      child: Text("立即预约" , style: TextStyle(
                                        fontSize: ScreenUtil().setSp(18) ,
                                        color: Colors.white ,
                                        fontWeight: FontWeight.bold 
                                      ),),
                                    ),
                                  ),
                                  onTap: (){
                                    FocusScope.of(context).requestFocus(FocusNode());
                                    if(phone != null && phone != ""){
                                      phone = phone.trim() ;
                                      if(typeId == null){
                                        Toast.show("请选择报考类型", context) ;
                                        return ;
                                      }
                                      if(phone.length != 11){
                                        Toast.show("手机号码格式不对", context) ;
                                        return ;
                                      }
                                      FunService().payDriver(phone , typeId.toString()).then((value) async{
                                        if(value["code"] == 200){
                                          var payResult = await aliPay(value["data"]) ;
                                          print(payResult) ;
                                        }else{
                                          Toast.show(value["msg"], context) ;
                                        }
                                      }) ;
                                    }else{
                                      Toast.show("手机号码不能为空", context) ;
                                    }
                                  },
                                ),
                              ],
                            ),
                          ),
                        ) ,
                        Container(
                          height: ScreenUtil().setHeight(100),
                          margin: EdgeInsets.only(left:ScreenUtil().setWidth(15) , right:ScreenUtil().setWidth(15) , top:ScreenUtil().setHeight(10)),
                          decoration: BoxDecoration(
                            border: Border.all(
                              color:Color.fromARGB(255, 238, 237, 239) ,
                            ) ,
                            borderRadius: BorderRadius.all(Radius.circular(8)),
                          ),
                          child:ClipRRect(
                            borderRadius: BorderRadius.all(Radius.circular(8)),
                            child:  CachedNetworkImage(
                              placeholder: (ct , url){
                                return Container(
                                  color: Color.fromARGB(255, 246, 245, 248),
                                  child: Center(
                                    child: Image.asset("assets/images/imageloading.png"),
                                  ),
                                ) ;
                              },
                              fit: BoxFit.fill ,
                              imageUrl: Config().getImgHost() + data["img"] ,
                            ),
                          ) ,
                        ) ,
                        Container(
                          margin: EdgeInsets.only(left:ScreenUtil().setWidth(19) , right:ScreenUtil().setWidth(19) , top:ScreenUtil().setHeight(32)) ,
                          child: Column(
                            crossAxisAlignment: CrossAxisAlignment.start ,
                            children: <Widget>[
                              Container(
                                child: Text("套餐详情" , style: TextStyle(
                                  fontSize: ScreenUtil().setSp(16) ,
                                  color: Color.fromARGB(255, 19, 28, 53) ,
                                  fontWeight: FontWeight.bold 
                                ),),
                              ) ,
                              Container(
                                margin: EdgeInsets.only(top:ScreenUtil().setHeight(15)),
                                child: Text(data["descTxt"] , style: TextStyle(
                                  fontSize: ScreenUtil().setSp(12) ,
                                  color: Color.fromARGB(255, 121, 132, 155)
                                ),),
                              )
                            ],
                          ),
                        ) ,
                      ],
                    ),
                  ),
                ),
              ) ,
            ] 
          )
        )
      )
    ) ;
  }
}